/**
 * 系统管理 用户管理
 */
<template>
  <div>
    <!-- 面包屑导航 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>系统管理</el-breadcrumb-item>
      <el-breadcrumb-item>客户端管理</el-breadcrumb-item>
    </el-breadcrumb>
    <!-- 搜索筛选 -->
    <el-form :inline="true"  class="user-search">
      <el-form-item label="">

      </el-form-item>

      <el-form-item>
        <el-button size="small" type="primary" icon="el-icon-search" >搜索</el-button>
      </el-form-item>
    </el-form>
    <!--列表-->
    <el-table size="small"  :data="tableData" highlight-current-row v-loading="tableLoading" border element-loading-text="拼命加载中" style="width: 100%;">
      <el-table-column align="center"  prop="clientId" label="编号">
      </el-table-column>
      <el-table-column align="center"  prop="clientSecret" label="密钥" >
      </el-table-column>
      <el-table-column align="center"  prop="scope" label="ip">
      </el-table-column>
      <el-table-column align="center"  prop="authorizedGrantTypes" label="授权模式" >
      </el-table-column>
      <el-table-column align="center"  prop="autoapprove" label="自动放行" >
      </el-table-column>
      <el-table-column align="center"  prop="accessTokenValidity" label="令牌时效" width="120">
      </el-table-column>
      <el-table-column align="center"  prop="refreshTokenValidity" label="刷新时效" width="120">
      </el-table-column>
    </el-table>

    <!-- 分页组件 -->
    <Pagination v-bind:child-msg="page" @callFather="callFather"></Pagination>

  </div>
</template>
<script>
  import Pagination from '../../../components/Pagination'
  import {addObj, delObj, fetchList, putObj} from '@/api/admin/client'
  import {mapGetters} from 'vuex'
  export default {
    name: 'log',
    data() {
      return {
        tableData: [],
        page: {
          total: 0, // 总页数
          currentPage: 1, // 当前页数
          pageSize: 20 // 每页显示多少条
        },
        tableLoading: false
      }
    },
    created() {
      this.getList();
    },
    // 注册组件
    components: {
      Pagination
    },
    mounted: function () {
    },

    computed: {
      ...mapGetters(['permissions'])
    },
    methods: {
      // 分页插件事件
      callFather(parm) {
        this.page.currentPage = parm.currentPage
        this.page.pageSize = parm.pageSize
        this.getList();
        //  this.getdata(this.formInline)
      },
      getList() {
        this.tableLoading = true
        fetchList(Object.assign({
          current: this.page.currentPage,
          size: this.page.pageSize
        }, )).then(response => {
          this.tableData = response.data.data.records
          this.page.total = response.data.data.total
          this.tableLoading = false
        })
      },

      rowDel: function (row, index) {
        var _this = this
        this.$confirm('是否确认删除ID为"' + row.id + '"的日志?', '警告', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(function () {
          return delObj(row.id)
        }).then(data => {
          this.getList(this.page)
          _this.$message({
            showClose: true,
            message: '删除成功',
            type: 'success'
          })
        }).catch(function (err) {
        })
      },
      /**
       * 搜索回调
       */
      searchChange(form) {
        this.getList(this.page, form)
      },
      /**
       * 刷新回调
       */
      refreshChange() {
        this.getList(this.page)
      }
    }
  }
</script>

<style scoped>
.user-search {
  margin-top: 20px;
}
.userRole {
  width: 100%;
}
</style>

